<template>
    <div class='content'>

        <section>
            <div class="profile_page">
                    <head-top  :go-back='goBack'  :head-title="profiletitle"></head-top>
            </div>
            <!--<div class="my_backlog" >-->
              <van-list
                v-model="loading"
                :finished="finished"
                finished-text="没有更多了"
                @load="onLoad"
                :offset="offset"
              >
                <div  v-for="item in remainData" :key="item.subid">
                  <div class="newsItem" @click="goToDetail(item.subid,item.taskType,item.personId)">
                    <div class="itemContent">
                      <div class="itemLists">
                        <div class="itemList">
                          <span class="itemName">申请类型</span>
                          <span class="itemType">{{item.procInstName}}</span>
                        </div>
                        <!-- <div class="itemList">
                          <span class="itemName">原因</span>
                          <span class="itemType">{{item.remark}}</span>
                        </div> -->
                        <div class="itemList">
                          <span class="itemName">开始时间</span>
                          <span class="itemType">{{item.startTime}}</span>
                        </div>
                        <div class="itemList">
                          <span class="itemName">状态</span>
                          <span class="itemType">{{item.currentStatus|dictNum }}</span>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </van-list>
        </section>
    </div>
</template>

<script>
    import headTop from '@/components/header/head';
    import {myApplay} from '@/service/getData';
    import {getStore} from '@/assets/config/mUtils';
    import { Dialog,Toast } from 'vant';
    export default {
    	data(){
            return{
                profiletitle:'我的申请',
                goBack:true,
                CHECK_TIME: new Date().getTime().toString(),
                app_userId:'',
                remainData:[],
                loading: false,
                finished: false,
                pageIndex:0,
                offset: 0,
            }
        },
        created(){
    	    this.app_userId = getStore('user_id');
        },
        mounted(){


        },
        props: ['imgSrc', 'menuTitle'],
        components:{
            headTop,
        },
        filters:{
          dictNum:function(val){
            if(val != '' ||val != null){
            var dictarr = [{ id: 2, text: '运行中'}, { id: 3, text: '正常结束'}, { id: 4, text: '本人撤销'}, { id: 5, text: '管理员撤销'}, { id: 6, text: '已驳回'}];
              var arr = dictarr.filter(item=>item.id == val);
              if(arr.length>0){
                  return arr[0].text;
              }


            }
          }
        },
        methods:{
          onLoad(){
            var data ={};
//             data.app_userId = this.app_userId;
//             data.CHECK_TIME = this.CHECK_TIME;
//             data.CHECK_SIGN = this.$md5(this.app_userId + this.CHECK_TIME +"3a28fba00c015e0df7f88556c91cb7fc");
            data.pageIndex = this.pageIndex;
            data.pageSize = 10;
            myApplay(data).then(res=>{
              // 加载状态结束
              this.loading = false;
              this.offset = 10 * this.pageIndex;
							if(this.remainData.length<res.data.total){
								this.remainData = this.remainData.concat(res.data.data) ;
							}else {
								this.finished = true;
							}
            });
            this.pageIndex+=1;
          },
          goToDetail(subid,taskType,personId){
//             this.$router.push(
//               { name: 'applyDetail', params: { subid: subid,taskType:taskType,personId:personId,useType:'look'}}
//             );
          }
        }
    }

</script>

<style lang="scss" scoped>
    @import '../../assets/style/mixin';
      @import '../../assets/style/public';
    .newsItem{
      padding-top: 0.5rem;
      .itemDate{
        display: flex;
        justify-content: center;
        font-size:0.6rem;
        color: #cccccc;
        height: 1.6rem;
        line-height:1.6rem;
      }
      .itemContent{
        margin: 0 0.5rem;
        background-color: #fff;
        padding: 0 0.4rem;
        border-top-left-radius: 0.2rem;
        border-top-right-radius: 0.2rem;
        position: relative;
        z-index: 99;
        .itemConHead{
          display: flex;
          align-items: center;
          font-size: 0.6rem;
          color: #333333;
          line-height: 0.8rem;
          padding:0.6rem 0;
          border-bottom: 1px solid #eee;
        }
        .itemLists{
          padding: 0.08rem;
          .itemList{
            display: flex;
            padding: 0.32rem 0;
            align-items: center;
            justify-content: flex-end;
            .itemName{
              color: #999999;
              font-size: 0.56rem;
              flex: 1;
              word-break: keep-all;
            }
            .itemType{
              margin-left: 0.4rem;
              color: #666666;
              font-size:0.56rem;
              width:8rem;
              white-space: normal;
              word-break: break-all;
            }
          }
        }
      }
      .itemNav{
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #1f9eff;
        font-size:0.6rem;
        height: 1.2rem;
        line-height:1.2rem;
        margin: 0 0.5rem;
        padding: 0.4rem;
        background-color: #fff;
        border-bottom-left-radius: 0.2rem;
        border-bottom-right-radius:0.2rem;
        overflow: hidden;
        .arrow{
          display: flex;
          align-items: center;
          img{
            width: 0.56rem;
            height: 0.56rem;
            vertical-align: top;

          }
        }
      }
    }
</style>
